<template>
  <div class="moneyManager">
    <div class="m-header">
      <div style="flex-grow: 2;">
        <div class="header-0">
          <div>
            <img src="../../../assets/images/material.png" alt="">
          </div>
          <div style="flex-grow: 5;">
            <div class="title">材料管理</div>
            <div class="text">管理建筑全生命周期中的材料和仓储库存</div>
          </div>
        </div>
      </div>
      <div class="header-1">
        <div class="title">预计采购金额(元)</div>
        <div class="text">--</div>
      </div>
      <div class="header-1">
        <div class="title">实际采购金额(元)</div>
        <div class="text">--</div>
      </div>
      <div class="header-1">
        <div class="title">实际消耗金额(元)</div>
        <div class="text">--</div>
      </div>
    </div>
    <div class="m-content">
      <div class="title">采购计划综合管理</div>
      <div class="main">
        <div style="width: 300px;">
          <router-link to="materialPlay">
            <div class="img">
              <img src="../../../assets/images/material0.png" alt="">
            </div>
            <div class="text">总采购计划管理</div>
            <div class="text1">
              以整个工程的施工预算为依据，计划全过程各主材/设备需求量
            </div>
          </router-link>
        </div>
        <div style="width: 300px;">
          <router-link to="materialInfo">
            <div class="img">
              <img src="../../../assets/images/material1.png" alt="">
            </div>
            <div class="text">采购信息管理</div>
            <div class="text1">
              综合统计意向合作单位，根据所供货的数量，与资金安排，制定相…
            </div>
          </router-link>
        </div>
      </div>
      <div class="title">仓储库存管理</div>
      <div class="main">
        <div style="width: 300px;">
          <router-link to="materiaLdepot">
            <div class="img">
              <img src="../../../assets/images/material2.png" alt="">
            </div>
            <div class="text">仓库管理</div>
            <div class="text1">
              定期对材料进行分类盘点，统计，判定是否本次为浪费或节约材料
            </div>
          </router-link>
        </div>
        <div style="width: 300px;">
          <router-link to="materialJunk">
            <div class="img">
              <img src="../../../assets/images/material3.png" alt="">
            </div>
            <div class="text">残料处理管理</div>
            <div class="text1">
              对残料分项目、数量及用途录入，对无法进行生产作业的材料统筹…
            </div>
          </router-link>
        </div>
      </div>
    </div>
  </div>
</template>

<script>

export default {
  name: 'MaterialManager',
  components: {

  },
  computed: {

  },
  watch: {

  },
  mounted() {}
}
</script>

<style lang="scss" scoped>
.moneyManager {
  .m-header{
    display: flex;
     background:rgba(37,38,47,1);
    // margin: 21px 18px 0 18px;
    div{
      flex: 1;
      width:100%;
      margin-right: 15px;
      .header-0{
        // height: 103px;
        margin: 22px 0 22px 22px;
        display: flex;
        div{
          .title{
            font-size:16px;
            font-weight:500;
            color:#F7B500;
            line-height:35px;
          }
          .text{
            font-size:14px;
            font-weight:400;
            color:rgba(255,255,255,0.85);
            line-height:24px;
          }
        }
      }
    }
    .header-1{
      text-align: center;
      .title{
        margin-top: 18px;
        font-size:14px;
        font-weight:400;
        color:#F7B500;
        line-height:35px;
      }
      .text{
        font-size:24px;
        font-weight:400;
        color:rgba(255,255,255,0.85);
        line-height:24px;
      }
    }
  }
  .m-content{
    .title{
      font-size:16px;
      font-weight:500;
      color:#ffffff;
      padding: 20px;
    }
    .main{
      display: flex;
      margin: 21px 18px 0 18px;
      div{
        cursor: pointer;
        width:100%;
        background:rgba(37,38,47,1);
        margin-right: 15px;
        .img{
         width: 100%;
         img{
           width: 100%;
         }
        }
        .text{
          font-size:16px;
          font-weight:500;
          color:#F7B500;
          padding: 8px;
          text-align: center;
        }
        .text1{
          font-size:14px;
          font-weight:400;
          color:#ffffff;
          padding: 8px;
          text-align: center;
        }
      }
    }
  }
}
</style>
